<php>
// ========================================================================
// * BigWe: util_my_mpnews_choose.html
//* =========================================================================
//* Copyright 2015-2016 eBeryl, Inc.
//* @author sherlockl
//* @Date 2016年11月1日
//* @describe 公用图文选择工具文件
//* @使用 响应函数如下
//  window.mpnewsChooseCallback = function(param) {
	// TODO....
//}
// * ========================================================================
</php>

<style type="text/css">
#my_mpnews .modal-dialog { width: 1000px; }
#my_mpnews .modal-body { padding: 0 0 0 15px; padding-top: 46px; }
#my_mpnews #mpnew_list { max-height: 360px; min-height: 360px; overflow: auto; position: relative; padding-right: 20px; }
#my_mpnews #mpnew_list .HeC { width: 311px; }
#my_mpnews #mpnew_list .js_HeC { cursor: pointer; }
#my_mpnews #mpnew_list .HeC:hover .mask { opacity: 1; }
#my_mpnews #mpnew_list .HeC.selected .mask { opacity: 1; cursor: default; }
#my_mpnews #mpnew_list .HeC .mask { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, .6); z-index: 1; color: #fff; opacity: 0; transition: all .5s ease; -webkit-transition: all .5s ease; }
#my_mpnews #mpnew_list .HeC .mask .ok_icon { position: absolute; font-size: 40px; top: 50%; text-align: center; width: 100%; margin-top: -23px; }
#my_mpnews .spinner { zoom: 1.8; position: absolute; top: 50%; margin-top: -15px; left: 0; right: 0; z-index: 1; }
#my_mpnews .noIntact_mask { position: absolute; top: 0; left: 0; z-index: 9; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); }
#my_mpnews .noIntact_mask > p { color: #fff; position: absolute; top: 50%; margin-top: -8px; width: 100%; text-align: center; }
#my_mpnews .noIntact_mask a { color: #459ae9; }
#my_mpnews .modal-footer { text-align: center; }
#my_mpnews .modal-footer .btn { width: 100px; }
#my_mpnews .mpnewsSearch { float: right; margin-right: 14px; }
#my_mpnews .modal-title { display: inline-block; }
#my_mpnews .modal-header { overflow: hidden; }
#my_mpnews .modal-header .close { margin-top: 0; }
#my_mpnews .pageControl { height: 50px; padding-right: 30px; }
#my_mpnews .groupChoose { width: 100%; padding: 8px 15px; position: absolute; left: 0; top: 0; z-index: 1; background: #fff; -moz-box-shadow: 0px 2px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(0, 0, 0, 0), 0px 3px 4px rgba(0, 0, 0, .1), 0px 0px 0px rgba(0, 0, 0, 0); -webkit-box-shadow: 0px 2px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(0, 0, 0, 0), 0px 3px 4px rgba(0, 0, 0, .1), 0px 0px 0px rgba(0, 0, 0, 0); box-shadow: 0px 2px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(0, 0, 0, 0), 0px 3px 4px rgba(0, 0, 0, .1), 0px 0px 0px rgba(0, 0, 0, 0); }
#my_mpnews .group_list { overflow: hidden; height: 28px; width: 720px; display: inline-block; vertical-align: top; transition: all .5s ease; -webkit-transition: all .5s ease; }
#my_mpnews .height_cacu button { border: 1px solid #c7c7c7; background: #fff; padding: 2px 12px; border-radius: 1px; min-width: 76px; margin-right: 10px; margin-bottom: 8px; }
#my_mpnews .height_cacu { }
#my_mpnews .height_cacu button.selected { background: #44B549 !important; border-color: #44B549 !important; color: #fff; }
#my_mpnews .creategraph { display: inline-block; vertical-align: top; padding: 3px 12px; border: 1px solid #00B74E; color: #00B74E; border-radius: 4px; float: right; }
#my_mpnews .more { display: inline-block; vertical-align: top; padding: 3px 12px; border: 1px solid #00B74E; color: #00B74E; border-radius: 0px; display: none; }
#my_mpnews .more.showmore { transition: all .5 ease; -webkit-transition: all .5 ease; }
#my_mpnews .more.showmore .glyphicon { transform: rotate(180deg); -webkit-transform: rotate(180deg); }
</style>
<include file="./Application/Home/View/Common/backup/util_my_mpnews_choose.html" />
<script type="text/javascript">
if (!$.fn.BlocksIt) {
	$('head').append("<script type=\"text/javascript\" src=\"/Public/static/js/common/blocksit.min.js\"><\/script>");
}
$(function () {
	var $me = $('#my_mpnews'),
	Mpnews = {};
	var queryParam = {
		'key': '',
		'custom_group_id': '',
		'p': 1,
		'l': 10
	}
	var isLoading = 0,
		isNoData = 0;

	var result = [];
	$me.on('shown.bs.modal', function() {
		$(this).show();
		$('#mpnew_list', $me).BlocksIt('reload');
		if ($('#mpnew_list .HeC', this).length) return;
		if (!Mpnews.firstLoad) {
			Mpnews.firstLoad = !0;
			ajaxRequest();
		}
	}).on('click', '.search_btn', function() {
		Mpnews.pageRest = 0;
		$.extend(queryParam, {
			p: 1,
			key: $('#my_mpnews .search_input').val()
		})
		ajaxRequest();
	}).on('click', '.height_cacu button', function() {
		$(this).addClass('selected').siblings().removeClass('selected');
		$.extend(queryParam, {
			p: 1,
			custom_group_id: $(this).attr('group_id') || ''
		});
		Mpnews.pageRest = 0;
		ajaxRequest();

	}).on('click', '#mpnews_sure', function() {

		var selected = $('.js_HeC.selected', $me);
		
		if (selected.length) {

			if (typeof window.mpnewsChooseCallback === 'function') {
				window.mpnewsChooseCallback.call($me, {
					'groupid': selected.attr('groupid') || '',
					'mpnewsArray': result[selected.index()],
					'mpnewsHtml': selected.prop('outerHTML')
				});
			}
			$me.modal('hide');
		} else {
			ShowTitleMessage.showWarning('请选择一个图文', showTime);
		}
	}).on('click', '.more', function() {
		if ($(this).hasClass('showmore')) {
			$(this).removeClass('showmore');
			$('.group_list', $me).height(28);
		} else {
			$(this).addClass('showmore');
			$('.group_list', $me).height($('.height_cacu', $me).height());
		}
	});

	$('#mpnew_list', $me).BlocksIt({
		numOfCol: 3,
		offsetX: 4,
		offsetY: 5
	}).on('click', '.js_HeC', function() {
		$(this).addClass('selected').siblings().removeClass('selected');
	});

	function pageRander(total) {
		$('.pageControl', $me).bwPagination({
			total: total,
			pageCount: queryParam.l,
			autoVisibility: !0,
			callback: function(index) {
				$.extend(queryParam, {p: index});
				ajaxRequest();
			}
		});
	}

	function ajaxRequest(fn) {
		isLoading = 1;
		$('.spinner', $me).show();
		$('#mpnew_list', $me).empty()
		$.ajax({
			type: 'post',
			url: BIGWE_API.MYMPNEWS.GET_FULL_MSG,
			data: queryParam,
			success: function(data) {
				data = typeof data === 'string' ? $.parseJSON(data) : data;
				if (!data.ret) {
					detailData = data.data;

					if (!Mpnews.pageRest) {
						Mpnews.pageRest = !0;
						pageRander(detailData.total);
					}

					if (!Mpnews.groupLoad) {
						Mpnews.groupLoad = !0;
						var groupHtml = '';
						for(i in detailData.customs) {
							var group = detailData.customs[i];
							groupHtml += '<button type="button" group_id="' + group.id + '">' + group.group_name + '</button>';
						}
						var cacuHieight = $('.height_cacu', $me).append(groupHtml).height();
						if (cacuHieight > 34) {
							$('.more', $me).show();
						}
					}

					if (!detailData.list.length) {
						ShowTitleMessage.showWarning('没有查询到数据', showTime);
						return;
					}
					result = detailData.list;
					var appendHtml = '';

					for(i in detailData.list) {
						appendHtml += getMpNewsHtml(detailData.list[i])
					}

					$('#mpnew_list', $me).html(appendHtml).BlocksIt('reload');
				}

				if (fn) {
					fn.call($me);
				}
				
			},
			complete: function(){
				isLoading = 0;
				$('.spinner', $me).hide();
			}
		});
	}
    function getMpNewsHtml(graphArray) {

    	var isIntact = isIntactGraph(graphArray);
        var html = '';

    	if (graphArray.articles && !graphArray.articles.length) return html;

        html += '<div class="HeC' + (isIntact ? ' js_HeC' : '') + '" groupid="' + graphArray.article_group + '">';
        if (isIntact) {
        	html += '<div class="mask"><span class="glyphicon glyphicon-ok ok_icon"></span></div>';
        }
        html += '<div class="outer_content">';
        html += '<div class="HeC_1">';
        if (graphArray.create_time) {
        	html += '<p class="upload_time">' + graphArray.create_time + '</p>';
        }

        if (graphArray.articles.length == 1 || !graphArray.articles[0].cover) {
            html += '<a class="title">' + (graphArray.articles[0].title || '') + '</a>';
        }

        if (graphArray.articles[0].cover) {

        	html += '<div class="HeC_1_inter">';
        	html += '<img class="cover" src="' + wechartImgCheck(graphArray.articles[0].cover) + '"/>';
        
	        if (graphArray.articles.length > 1) {
	            html += '<a target="_blank" class="graph_gray">' + graphArray.articles[0].title + '</a>';
	        }
        	html += '</div>';
        }

        if (graphArray.articles.length == 1) {
            html += '<div class="desc">' + (graphArray.articles[0].summary || '') + '</div>';
        }

        html += '</div>';
        html += '<div class="content">';
        html += '<table>';
        html += '<tbody>';

        for (i in graphArray.articles) {
            if (i != '0') {
                html += '<tr><td>';
                html += '<a target="_blank">' + graphArray.articles[i].title + '</a>';
                html += '</td><td>';
                if (graphArray.articles[i].cover) {
                	html += '<img class="cover_right" src="' + wechartImgCheck(graphArray.articles[i].cover) + '"/>';
                }
                html += '</td></tr>';
            }
        }

        html += '</tbody>';
        html += '</table>';
        html += '</div>';

        if (!isIntact) {
        	html += '<div class="noIntact_mask">';
        	html += '<p>图文不完整，无法选中，<a href="/edit_text?article_group=' + graphArray.article_group + '" target="_blank">继续编辑</a></p>'
        	html += '</div>';
        }

        html += '</div>';
        html += '</div>';

        return html;

    }

    function isIntactGraph(graphObj) {
    	if (!graphObj.is_complete) return false;

		for (i in graphObj.articles) {
			var article = graphObj.articles[i];
			if (!article.title || !article.cover) {
				return false;
			}
		}
		return true;
	}
});
</script>